<template>
  <!--登录-->
  <div class="wrap">
    <div class="tdbModule loginPage">
      <div class="registerTitle">用户登录</div>
      <div class="registerCont">
        <ul>
          <li>
            <span class="dis"></span>
            <input v-model="userInfo.userType" type="radio" value="1" />
            投资人
            <input v-model="userInfo.userType" type="radio" value="2" />
            借款人
          </li>
          <li>
            <span class="dis">手机号：</span>
            <input class="input" v-model="userInfo.mobile" />
          </li>

          <li>
            <span class="dis">密码：</span>
            <input class="input" v-model="userInfo.password" type="password" />
          </li>
          <li class="btn">
            <button @click="login()" :class="{ disabled: !isValid }">
              立即登录
            </button>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import "~/assets/css/register.css";
import cookie from "js-cookie";

export default {
  data() {
    return {
      userInfo: {
        userType: 1,
      },
      isValid: true, //表单校验是否成功
    };
  },
  mounted() {
    if (this.$route.query.msg) {
      this.$message.warning("登录状态失效,请重新登录");
    }
  },
  methods: {
    //登录
    login() {
      //发起登录的异步请求
      this.$axios.$post("/api/core/userInfo/login", this.userInfo).then((r) => {
        console.log(r);
        /*
          页面间的数据共享： 
              简单的参数：id/字符串  使用路径参数或者请求参数 携带
              复杂的多个页面都需要使用的数据：
                  cookie：设置后  以后访问后端接口会自动携带cookie，可以设置cookie的作用域 以及过期时间
                  localstorage： 设置后 浏览器持久化保存 不会主动过期 不会自动携带访问后端接口
        */
        cookie.set("SRB-TOKEN", r.data.token);
        window.location = "/user";
      });
    },
  },
};
</script>
